import React, {Component} from 'react';
import {Select} from 'antd';

const {Option} = Select;

class MySelect extends Component {
  render() {
    const {data, placeholder, onChange, onFocus, onBlur, onSearch, value} = this.props;
    return (
      <Select
        className='MySelect'
        showSearch
        style={{width: 200}}
        placeholder={placeholder}
        optionFilterProp="children"
        onChange={onChange}
        onFocus={onFocus}
        onBlur={onBlur}
        value={value}
        filterOption={(input, option) =>
          option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
      >
        {
          data.map((item, index) => (
            <Option value={item.id} key={item.id}>{item.name}</Option>
          ))
        }
      </Select>
    );
  }
}

export default MySelect;
